---
layout: default
---

<section class="wrapper wrapper-post">
  <div class="wrapper-container">

    {% if page.use_toc %}
      <aside class="toc-container">
        {{ page.content | fancytoc }}
        <div class="toc-btn"><em class="arrow"><span><i class="fa fa-bars"></i></span></em></div>
      </aside>
    {% endif %}

    <article itemscope itemtype="http://schema.org/BlogPosting" role="article" class="post">
	    <section class="post-container">
	      <header class="post-header">
	        <ul class="post-meta-list">
	          <li class="post-meta-item">
	            <time datetime="{{page.date | date_to_string}}" itemprop="datePublished">
	              {{page.date | date_to_string}}
	            </time>
	          </li>
	          <li class="post-meta-item">
              {{page.category}} &raquo;
	          </li>
	          {% if page.tags %}
	            <li class="post-meta-item">
	              {% for tag in page.tags %}
	                <a href='/tag/{{tag}}'>
                    <span class="tag-tip"></span>
                    <span class="tag">{{tag}}</span>
                  </a>
	              {% endfor %}
	            </li>
              {% comment %} todo 加入tags generated page 的支持 {% endcomment %}
	          {% endif %}
	          <li class="post-meta-item">
	            <a href="#disqus_thread" data-disqus-identifier="{{page.title}}"></a>
	          </li>
	        </ul>
	        <h1 itemprop="name headline" class="post-title"><a href="{{page.url}}" itemprop="url" data-pjax title="{{page.title}}">{{page.title}}</a></h1>
					{% if page.subtitle %}
						<h2 itemprop="about" class="post-subtitle">{{page.subtitle}}</h2>
					{% endif %}

	      </header>

        <!--漂浮在左边-->
	      <aside class="post-side">
	        <div class="post-author">
	          {% if site.author.image %}
	            <a href="/" class="post-author-avatar">
	              <img src="{{site.author.image}}" alt="{{site.author.bio}}">
	            </a>
	          {% endif %}
	          <div class="post-author-info">
	            <a href="{{site.author.website}}" class="post-author-name">
	              {{site.author.name}}
	            </a>
	          </div>
	        </div>
	      </aside>

        <aside id="back-to-top">
          <a href="javascript:void(0);"><i class="fa fa-arrow-up"></i></a>
        </aside>

	      <div itemprop="articleBody" class="post-body">
          {{content}}
	      </div>

        {% comment %}
        <!--调试页面用-->
	      <div itemprop="articleBody" class="post-body">
	        {% for what in page %}
            <div>{{what}}</div>
	        {% endfor %}
	      </div>
        {% endcomment %}
	      <footer class="post-footer">
	        <div itemprop="author" itemscope itemtype="http://schema.org/Person" class="post-author">
          {% comment %}
	          {% if site.author.image %}
	            <a href="{{site.author.website}}" class="post-author-avatar">
	              <img itemprop="image" src="{{site.author.image}}" alt="{{site.author.bio}}">
	            </a>
	          {% endif %}
          {% endcomment %}
	          <div class="post-author-info">
              <h4 class="post-footer-heading">{{ page.title }}</h4>
	            <a href="{{site.author.website}}" itemprop="url" class="post-author-name">
	              <span itemprop="name">{{author.name}}</span>
	            </a>
	            <p class="post-info">
	              <b class="post-info-title">发布于</b>
	              <time class="post-date">{{page.date | date_to_string}}</time>
	            </p>
	          </div>
	        </div>
	        <div class="post-social">
						<!--<h4 class="post-footer-heading">分享这篇文章</h4>-->
						<!--<a href="#" data-action="share-twitter"><i class="fa fa-fw fa-lg fa-twitter"></i></a>-->
						<!--<a href="#" data-action="share-facebook"><i class="fa fa-fw fa-lg fa-facebook"></i></a>-->
            <!--<a href="#" data-action="share-gplus"><i class="fa fa-fw fa-lg fa-google-plus"></i></a>-->

            {% comment %}
            <div class="jia_area">
              <!-- JiaThis Button BEGIN -->
              <div class="jiathis_style">
                <a class="jiathis_like_tsina"></a>
                <a class="jiathis_like_douban"></a>
              </div>
              <script type="text/javascript">
                var jiathis_config = {data_track_clickback:'true'};
              </script>
              <script type="text/javascript" src="http://v3.jiathis.com/code_mini/jia.js?uid=1393985045106532" charset="utf-8"></script>
              <!-- JiaThis Button END -->
            </div>
            {% endcomment %}

	        </div>
	      </footer>
	    </section>

      <section class="post-related">
        <h3 class="related-header">相关文章</h3>
        <ul class="related-posts-list">
          {% for post in site.related_posts limit:3 %}
            <li class="related-item">
                <a href="{{ post.url }}">{{ post.title }} </a>
                {% comment %}
                <small>{{ post.date | date: "%y-%m-%d" }}</small>
                {% endcomment %}
            </li>
          {% endfor %}
        </ul>
      </section>

    </article>
  </div>
</section>

{% comment %}
<script type="text/javascript">

  // insert disqus
  (function () {
    var disqus_shortname = 'hikerpigblog';

    /*    disqus_title,*/
    /*    disqus_url,*/
    /*    disqus_category_id;*/
    var s = document.createElement('script');
    s.async = true;
    s.type = 'text/javascript';
    s.src = '//' + disqus_shortname + '.disqus.com/count.js';
    (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
  }());
</script>
{% endcomment %}

{% include footer.html %}
